<%--
  Created by IntelliJ IDEA.
  User: liguanchen0629
  Date: 2021/6/24
  Time: 9:23
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>管理员管理汽车主页</title>
    <%
        pageContext.setAttribute("APP_PATH", request.getContextPath());
    %>
    <script src="${APP_PATH}/static/js/jquery-3.1.1.min.js"></script>
    <link rel="stylesheet"
          href="${APP_PATH}/static/bootstrap-3.4.1-dist/css/bootstrap.min.css">
    <script
            src="${APP_PATH}/static/bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
    <!-- 标题行 -->
    <div class="row">
        <div class="col-xs-12">
            <h1>管理员页面</h1>
        </div>
    </div>
    <div class="row">
			<div class="col-md-10">
				<form action="${APP_PATH}/something/administrator">
					<button type="submit" class="btn btn-success">管理页面</button>
				</form>
			</div>
		</div>
    <!-- 显示表格数据 -->
    <div class="row">
        <div class="col-md-12">

            <!-- 按钮 -->
            <div class="row">
                <div class="col-md-4 col-md-offset-8">
                    <!-- <button class="btn btn-primary" id="insert_btn">新增</button> -->
                    <button class="btn btn-primary" data-toggle="modal"
                            data-target="#myModal">
                        <span class="glyphicon glyphicon-plus">增加</span>
                    </button>
                    <!-- 增加——模态框 -->
                    <div class="modal fade" id="myModal" tabindex="-1" role="dialog"
                         aria-labelledby="myModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal"
                                            aria-hidden="true">×
                                    </button>
                                    <h4 class="modal-title" id="myModalLabel">新增汽车</h4>
                                </div>
                                <div class="modal-body">
                                    <!-- form表单 -->
                                    <form action="${APP_PATH}/car/insertCar" method="post">
                                        汽车价格：<input type="text" name="price" placeholder="汽车价格" required="required"><br>
                                        <br>
                                        汽车品牌：<input type="text" name="brand" placeholder="汽车品牌" required="required"><br>
                                        <br>
                                        汽车类型：<input type="text" name="type" placeholder="汽车类型" required="required"><br>
                                        <br>
                                        车牌号：<input type="text" name="number" placeholder="车牌号" required="required"><br>
                                        <br>
                                        <input type="submit" class="btn btn-default" value="提交"/>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default"
                                            data-dismiss="modal">关闭
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>


            <table class="table table-hover">
                <tr>
                    <th>id</th>
                    <th>price</th>
                    <th>brand</th>
                    <th>type</th>
                    <th>number</th>
                    <th>操作</th>
                </tr>
                <c:forEach items="${info.list}" var="car">
                    <tr>
                        <th>${car.id }</th>
                        <th>${car.price }</th>
                        <th>${car.brand}</th>
                        <th>${car.type}</th>
                        <th>${car.number}</th>
                        <th>
                            <button class="btn btn-primary btn-sm" data-toggle="modal"
                                    data-target="#myEditModal">
                                <span class="glyphicon glyphicon-pencil" aria-hidden="true"
                                      onclick="Values1('${car.id}')">编辑</span>
                            </button>

                            <div class="modal fade" id="myEditModal" tabindex="-1"
                                 role="dialog">
                                <div class="modal-dialog" role="document">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <button type="button" class="close" data-dismiss="modal"
                                                    aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                            </button>
                                            <h4 class="modal-title">修改信息</h4>
                                        </div>
                                        <div class="modal-body">
                                            <form
                                                    action="${APP_PATH}/car/editCar"
                                                    method="post">
                                                <input type="hidden" id="id1" name="id" value="">
                                                汽车价格：<input type="text" name="price" placeholder="汽车价格"
                                                            required="required"><br> <br>
                                                汽车品牌：<input type="text" name="brand" placeholder="汽车品牌"
                                                            required="required"><br> <br>
                                                汽车类型：<input type="text" name="type" placeholder="汽车类型"
                                                            required="required"><br> <br>
                                                车牌号：<input type="text" name="number" placeholder="车牌号"
                                                           required="required"><br> <br>
                                                <input type="submit" value="提交" class="btn btn-default">
                                            </form>
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-default"
                                                    data-dismiss="modal">关闭
                                            </button>
                                        </div>
                                    </div>
                                    <!-- /.modal-content -->
                                </div>
                                <!-- /.modal-dialog -->
                            </div>

                            <button class="btn btn-danger btn-sm" data-toggle="modal"
                                    data-target="#myDeleteModal">
                                <span class="glyphicon glyphicon-trash" aria-hidden="true" onclick="Values2(${car.id})">删除</span>
                            </button>
                            <div class="modal fade" id="myDeleteModal" tabindex="-1"
                                 role="dialog">
                                <div class="modal-dialog" role="document">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <button type="button" class="close" data-dismiss="modal"
                                                    aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                            </button>
                                            <h4 class="modal-title">删除信息</h4>
                                        </div>
                                        <div class="modal-body">
                                            <form action="${APP_PATH}/car/deleteCar"
                                                  method="post">
                                                <input type="hidden" id="id2" name="id" value="">
                                                <input type="submit" value="删除" class="btn btn-default">
                                            </form>
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-default"
                                                    data-dismiss="modal">关闭
                                            </button>
                                        </div>
                                    </div>
                                    <!-- /.modal-content -->
                                </div>
                                <!-- /.modal-dialog -->
                            </div>

                        </th>
                    </tr>
                </c:forEach>
            </table>
        </div>
    </div>
    <!-- 分页信息 -->
    <div class="row">
        <!-- 分页文字信息 -->
        <div class="col-md-6">当前${info.pageNum }页,总${info.pages }页,总${info.total }条记录
        </div>
        <!-- 分页条信息 -->
        <div class="col-md-6">
            <nav aria-label="Page navigation">
                <ul class="pagination">
                    <li><a href="${APP_PATH }/car/manager-cargetall?pn=1">首页</a></li>
                    <c:if test="${info.hasPreviousPage }">
                        <li><a href="${APP_PATH }/car/manager-cargetall?pn=${info.pageNum-1}"
                               aria-label="Previous"> <span aria-hidden="true">&laquo;</span>
                        </a></li>
                    </c:if>
                    <c:forEach items="${info.navigatepageNums }" var="page_Num">
                        <c:if test="${page_Num == info.pageNum }">
                            <li class="active"><a href="#">${page_Num }</a></li>
                        </c:if>
                        <c:if test="${page_Num != info.pageNum }">
                            <li><a href="${APP_PATH }/car/manager-cargetall?pn=${page_Num}">${page_Num}</a></li>
                        </c:if>
                    </c:forEach>
                    <c:if test="${info.hasNextPage }">
                        <li><a href="${APP_PATH }/car/manager-cargetall?pn=${info.pageNum+1}" aria-label="Next"> <span
                                aria-hidden="true">&raquo;</span>
                        </a></li>
                    </c:if>

                    <li><a href="${APP_PATH }/car/manager-cargetall?pn=${info.pages}">末页</a></li>
                </ul>
            </nav>
        </div>
    </div>
</div>
<script type="text/javascript">
    function deleteCar(id) {
        if (confirm('是否删除该车辆？')) {
            $.ajax({
                url: "${APP_PATH }/car/deleteCar",
                data: {"id": id},
                type: "POST",
                // success: function (data) {
                //     if (data == "OK") {
                //         alert("删除成功");
                //         console.log("ok");
                //         window.location.reload();
                //     } else {
                //         alert("删除失败");
                //         console.log("fail");
                //         window.location.reload();
                //     }
                // }
            });
        }
    };

    $("#myEditModal").modal("hide");
    $("#myDeleteModal").modal("hide");

    function Values1(id) {
        $("#id1").val(id);
    }

    function Values2(id) {
        $("#id2").val(id);
    }
</script>
</body>
</html>
